@charset "utf-8";
/* 全局基础样式 */
*{
    margin:0;
    padding:0;
    font-family: "楷体";
    font-size: 80px;
}

body{
    background:url(../作业图片/背景图.jpg);
    background-size: 100% 723px;
    background-repeat: no-repeat;
}

/* 贪吃蛇动画 */
.snake{
    width: 100px;
    height: 100px;
    border: 1px solid red;
    background:url(../作业图片/snake.jpg);
    background-size: 100% 100%;
    position: relative;
    top:18px;
    left:75px;
    animation: snake 8s linear infinite;
}

@keyframes snake{
    0%{
        top: 18px;
        left: 75px;
        transform: rotate(100deg) scale(1);
    }
    8%{
        top:190px;
        left:75px;
        background: url(../作业图片/snake.jpg);
        background-size: 100% 100%;
        transform: rotate(200deg) scale(1);
    }
    16%{
        top:350px;
        left:75px;
        background:url(../作业图片/snake1.jpg);
        background-size: 100% 100%;
        transform: rotate(300deg) scale(2);
    }
    24%{
        top:350px;
        left:521px;
        background:url(../作业图片/snake2.jpg);
        background-size: 100% 100%;
        transform: rotate(400deg) scale(3);
    }
    32%{
        top:350px;
        left:521px;
        background:url(../作业图片/snake3.jpg);
        background-size: 100% 100%;
        transform: rotate(360deg) scale(3);
    }
    48%{
        top:190px;
        left:521px;
        background:url(../作业图片/snake3.jpg);
        background-size: 100% 100%;
        transform: rotate(360deg) scale(3);
    }
    56%{
        top:18px;
        left:521px;
        background:url(../作业图片/snake4.jpg);
        background-size: 100% 100%;
        transform: rotate(360deg) scale(3);
    }
    64%{
        top:18px;
        left:902px;
        background:url(../作业图片/snake5.jpg);
        background-size: 100% 100%;
        transform: rotate(360deg) scale(3);
    }
    72%{
        top:190px;
        left:902px;
        background:url(../作业图片/snake6.jpg);
        background-size: 100% 100%;
        transform: rotate(360deg) scale(3);
    }
    80%{
        top:350px;
        left:902px;
        background:url(../作业图片/snake7.jpg);
        background-size: 100% 100%;
        transform: rotate(360deg) scale(3);
    }
    88%{
        top:350px;
        left:1305px;
        background:url(../作业图片/snake8.jpg);
        background-size: 100% 100%;
        transform: rotate(360deg) scale(2);
    }
    96%{
        top:190px;
        left:1305px;
        background:url(../作业图片/snake9.jpg);
        background-size: 100% 100%;
        transform: rotate(360deg) scale(2);
    }
    100%{
        top:18px;
        left:1305px;
        background:url(../作业图片/snake10.jpg);
        background-size: 100% 100%;
        transform: rotate(360deg) scale(1);
    }
}

/* 第一个球（qiou）动画 */
.qiou{
    width: 100px;
    height: 100px;
    border: 1px solid red;
    background: url(../作业图片/白球.jpg);
    background-size: 100% 100%;
    position: relative;
    top:260px;
    left:350px;
    animation: qiou 8s linear infinite;
}

@keyframes qiou{
    0%{
        top:260px;
        left:350px;
    }
    10%{
        top:550px;
        left:521px;
        background: url(../作业图片/黄1.jpg);
        background-size: 100% 100%;
    }
    20%{
        top:390px;
        left:521px;
        background:url(../作业图片/彩11.jpg);
        background-size: 100% 100%;
    }
    30%{
        top:218px;
        left:521px;
        background:url(../作业图片/黑⑧.jpg);
        background-size: 100% 100%;
    }
    40%{
        top:-118px;
        left:902px;
        background: url(../作业图片/白球.jpg);
        background-size: 100% 100%;
    }
    50%{
        top:-90px;
        left:902px;
        background: url(../作业图片/黄1.jpg);
        background-size: 100% 100%;
    }
    60%{
        top:150px;
        left:902px;
        background: url(../作业图片/彩11.jpg);
        background-size: 100% 100%;
    }
    70%{
        top:550px;
        left:1305px;
        background: url(../作业图片/黑⑧.jpg);
        background-size: 100% 100%;
    }
    80%{
        top:390px;
        left:1305px;
        background: url(../作业图片/白球.jpg);
        background-size: 100% 100%;
    }
    90%{
        top:218px;
        left:1305px;
        background: url(../作业图片/黄1.jpg);
        background-size: 100% 100%;
    }
}

/* 第二个球（qiou1）动画 */
.qiou1{
    width: 100px;
    height: 100px;
    border: 1px solid red;
    background: url(../作业图片/黄1.jpg);
    background-size: 100% 100%;
    position: relative;
    top:-181px;
    left:700px;
    animation: qiou1 8s linear infinite;
}

@keyframes qiou1{
    0%{
        top:-181px;
        left:700px;
    }
    10%{
        top:-218px;
        left:902px;
        background: url(../作业图片/彩11.jpg);
        background-size: 100% 100%;
    }
    20%{
        top:-90px;
        left:902px;
        background: url(../作业图片/黑⑧.jpg);
        background-size: 100% 100%;
    }
    30%{
        top:150px;
        left:902px;
        background: url(../作业图片/白球.jpg);
        background-size: 100% 100%;
    }
    40%{
        top:650px;
        left:1305px;
        background: url(../作业图片/黄1.jpg);
        background-size: 100% 100%;
    }
    50%{
        top:490px;
        left:1305px;
        background: url(../作业图片/彩11.jpg);
        background-size: 100% 100%;
    }
    60%{
        top:318px;
        left:1305px;
        background: url(../作业图片/黑⑧.jpg);
        background-size: 100% 100%;
    }
}

/* 第三个球（qiou2）动画 */
.qiou2{
    width: 100px;
    height: 100px;
    border: 1px solid red;
    background: url(../作业图片/彩11.jpg);
    background-size: 100% 100%;
    position: relative;
    top:40px;
    left:1083px;
    animation: qiou2 8s linear infinite;
}

@keyframes qiou2{
    0%{
        top:40px;
        left:1083px;
    }
    25%{
        top:750px;
        left:1305px;
        background: url(../作业图片/彩11.jpg);
        background-size: 100% 100%;
    }
    50%{
        top:590px;
        left:1305px;
        background: url(../作业图片/黑⑧.jpg);
        background-size: 100% 100%;
    }
    75%{
        top:418px;
        left:1305px;
        background: url(../作业图片/白球.jpg);
        background-size: 100% 100%;
    }
}